<template>
  <div class="articleItem">
    <van-cell-group  >
      <van-cell :to="'/detail/'+row.art_id"  :title="row.title" >
        <!-- 自定义右侧内容 -->
        <template>
          <van-image
            class="right-img"
            v-if="row.cover.type===1"
            :src="row.cover.images[0]"
          />
        </template>
        <!-- 自定义 label 内容 -->
        <template #label>
          <div class="img-box" v-if="row.cover.type===3">
          <van-image
          v-for="(item,index) in row.cover.images"
          :key="index"
            width="100"
            height="100"
            :src="item"
          />
          </div>
          <span>{{row.aut_name}}</span>
          <span class="comment-num">{{row.comm_count}}评论</span>
          <span>{{row.pubdate|relativeTime}}</span>
        </template>
      </van-cell>
    </van-cell-group>
  </div>
</template>

<script>
export default {
  name: 'ArticleItem',
  props: {
    row: {
      type: Object, // 获取数组里面的  必须 单词
      required: true// 必须的
    }
  },

  data () {
    return {

    }
  },

  created () {

  },

  methods: {

  }
}
</script>

<style scoped lang='less'>
.articleItem{
  .comment-num{
    padding: 0 15px;
  }
  .img-box{
    display: flex;
    justify-content: space-between;
  }
  .right-img{
    width: 232px;
    height: 146px;
  }
}
</style>
